<template>
	<view class="content">
		<div class="login">
			<p class="title">汽车租赁平台</p>
			<input type="text" placeholder="请输入用户名" class="input" v-model="form.username">
			<input type="password" placeholder="请输入密码" class="input" v-model="form.password">

			<button type="primary" @click="login()">登录</button>
			<view class="qzc" @click="register">
				还没有账号？去注册
			</view>
		</div>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				form: {}
			}
		},
		onLoad() {

		},
		methods: {
			login() {
				uni.request({
					url: "/index/user",
					method: "get",
					data: this.form,
					success: (res) => {
						console.log(res)
						if (res.data.code == 200) {
							uni.showToast({
								title: "登录成功"
							})
						uni.setStorageSync("userinfo",JSON.stringify(res.data.data))
						uni.switchTab({
							url:"/pages/shouye/shouye"
						})
							// this.register()
						}else{
							uni.showToast({
								title: res.data.msg
							})
						}
					}
				})
			},
			register() {
				uni.navigateTo({
					url: "/pages/register/register"
				})
			},
		}
	}
</script>

<style scoped>
	.qzc {
		text-align: right;
		font-size: 14px;
		color: #1369EB;

	}

	.title {
		text-align: center;
		color: #000;
		font-weight: 800;
		font-size: 25px;

	}

	.input {
		margin-bottom: 15px;
		height: 40px;
		line-height: 40px;
		border-bottom: 1px solid #000;
	}

	.login {
		width: 50%;
		height: auto;
		padding: 10px;
		box-sizing: border-box;
		background: rgba(255, 255, 255, 0.7);
		position: absolute;
		top: 33%;
		left: 23%;
		border-radius: 10px;

	}

	.content {
		width: 100%;
		height: 100%;
		background: url("../../static/zl.jpg") no-repeat;
		background-size: 100% 100%;
		position: relative;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}
</style>